<template>
	<view class="bd-t">
		<u-tabs-swiper class="tabs" ref="uTabs" :list="list" :current="current" :is-scroll="false" bar-width="72"
			bar-height="6" swiperWidth="750" @change="tabsChange" :gutter="10" inactive-color="#939393" :bar-style="{background: '#E10000'}" active-color="#E10000"></u-tabs-swiper>
		<swiper :current="swiperCurrent" @transition="transition" @change="swiperChange" @animationfinish="animationfinish" class="swiper">
			<swiper-item class="swiper-item">
				<scroll-view scroll-y @scrolltolower="onreachBottom" class="scroll-view">
					<listComp :list="listData" :typeNum="1"></listComp>
				</scroll-view>
			</swiper-item>
			<swiper-item class="swiper-item">
				<scroll-view scroll-y @scrolltolower="onreachBottom" class="scroll-view">
					<listComp :list="listData" :typeNum="2"></listComp>
				</scroll-view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	import * as logApi from '@/api/record'
	import listComp from './components/listComp.vue'
	export default {
		components: {
			listComp
		},
		onLoad(option) {
		 this.type = option.type
		 this.cuttent = option.type
		 this.swiperCurrent = option.type
		 this.getList(this.current)
		},
		data() {
			return {
				listData: [],
				type: 0,
				list: [{
						name: '总收入'
					},
					{
						name: '提现历史'
					}
				],
				current: 0,
				swiperCurrent: 0,
				pageSize: 10,
				typeArr: [{
						status: 1,
						page: 1,
					},
					{
						status: null,
						page: 1,
					},
				],
			};
		},
		methods: {
			tabsChange(e) {
				this.swiperCurrent = e
			},
			//swiper-item左右移动,
			transition(e) {
				let dx = e.detail.dx
				this.$refs.uTabs.setDx(dx);
			},
			swiperChange(e) {
				let current = e.detail.current;
				this.typeArr[current].page = 1
				this.getList(current)
			},
			animationfinish(e) {
				let current = e.detail.current;
				this.$refs.uTabs.setFinishCurrent(current);
				this.swiperCurrent = current;
				this.current = current;
			},
			getList(current) {
				let { status, page } = this.typeArr[current]
				let pageSize = this.pageSize
				let props = {
					 page, pageSize
				}
				if(this.typeArr[current].status) {
					props.status = status
					logApi.balance(props).then(res => {
						if(page == 1) {
							this.listData = res.data.data.data
						}else {
							this.listData.push(...res.data.data.data)
						}
					})
				}else {
					logApi.withdraw(props).then(res => {
						if(page == 1) {
							this.listData = res.data.data.list.data
						}else {
							this.listData.push(...res.data.data.list.data)
						}
					})
				}

			},
			onreachBottom() {
				this.typeArr[this.current].page += 1
				this.getList(this.current)
			}
		}
	}
</script>

<style lang="scss">
	.bd-t {
		height: 710upx;
		border-top: 1px solid #F3F6F2;
	}
	.swiper {
		width: 100%;
		height: 1100upx;
	}
	.swiper-item {
		height: 100%;
	}
	.scroll-view {
		height: 100%;
	}
</style>
